import React,{Component} from 'react';
import {Button, Form, Input, message} from "antd";
import ajax from "../../../util/AjaxUtil";
import qs from "qs";

class EditDataSource extends Component{

    constructor(props){
        super(props);

        if(props.onRef!=null && Object.prototype.toString.call(props.onRef) === '[object Function]'){
            props.onRef(this);
        }

        this.state={
            data:props.data,
            testLoading:false
        };

        this.getData=this.getData.bind(this);
        this.testConnect=this.testConnect.bind(this);
    }

    componentWillReceiveProps(nextProps){
        if (nextProps!==this.props){
            this.setState({
                data:nextProps.data
            });
        }
        return nextProps!==this.props;
    }

    render() {
        const {getFieldDecorator, getFieldsError, getFieldError, isFieldTouched} = this.props.form;
        const formItemLayout = {
            labelCol: {
                xs: { span: 24 },
                sm: { span: 8 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 16 },
            }
        };

        return (
            <Form {...formItemLayout} onSubmit={this.handleSubmit}>
                <Form.Item label="连接名称" key={'name'}>
                    {getFieldDecorator('name',{rules:[{
                            required: true,
                            message: '请输入连接名称',
                        }],initialValue:this.state.data!=null?this.state.data.name:null})(
                        <Input/>
                    )}
                </Form.Item>
                <Form.Item label="类型" key={'type'}>
                    {getFieldDecorator('type',{rules:[{
                            required: true,
                            message: '请输入类型',
                        }],initialValue:this.state.data!=null?this.state.data.type:null})(
                        <Input/>
                    )}
                </Form.Item>
                <Form.Item label="驱动类" key={'driverClass'}>
                    {getFieldDecorator('driverClass',{rules:[{
                            required: true,
                            message: '请输入驱动类',
                        }],initialValue:this.state.data!=null?this.state.data.driverClass:null})(
                        <Input/>
                    )}
                </Form.Item>
                <Form.Item label="链接地址" key={'url'}>
                    {getFieldDecorator('url',{rules:[{
                            required: true,
                            message: '请输入链接地址',
                        }],initialValue:this.state.data!=null?this.state.data.url:null})(
                        <Input/>
                    )}
                </Form.Item>
                <Form.Item label="用户名" key={'username'}>
                    {getFieldDecorator('username',{rules:[{
                            required: true,
                            message: '请输入用户名',
                        }],initialValue:this.state.data!=null?this.state.data.username:null})(
                        <Input autocomplete="off"/>
                    )}
                </Form.Item>

                <Form.Item label="密码" key={'password'}>
                    {getFieldDecorator('password',{rules:[{
                            required: true,
                            message: '请输入密码',
                        }],initialValue:this.state.data!=null?this.state.data.password:null})(
                        <Input autocomplete="off"/>
                    )}
                </Form.Item>

                <p style={{textAlign:'center'}}>
                    <Button type="primary" loading={this.state.testLoading} onClick={this.testConnect}>
                        测试连接数据库
                    </Button>
                </p>
            </Form>
        );
    }

    handleSubmit(e) {
        if (e != null) {
            e.preventDefault()
        }
    }

    getData(){
        return this.state.data;
    }

    testConnect(){
        if (!this.state.testLoading){
            let param=this.props.form.getFieldsValue();
            this.setState({
                testLoading:true
            });
            ajax.post("/report/datasource/testConnect",qs.stringify(param)).then(response=>{
                if (response.data.result){
                    message.success("连接成功");
                } else {
                    message.error("连接失败!");
                }
                this.setState({
                    testLoading:false
                });
            }).catch(error=>{
                this.setState({
                    testLoading:false
                });
            });
        }
    }
}

export default Form.create()(EditDataSource);